<template>
      <div class="info-box" >
            <div class="main-info" v-if="infoSee">
                  <div class="updateImg">
                        <el-avatar shape="square" :size="100" fit="fill" v-if="currentUser.userAvatar==null?'':currentUser.userAvatar" :src="currentUser.userAvatar"></el-avatar>
                        <el-button @click="updateUserAvatar()" type="success" size="mini">修改头像,上传</el-button>
                        <el-upload
                              class="elupload"
                              action="#"
                              list-type="picture-card"
                              :auto-upload="false">
                              <i slot="default" class="el-icon-plus"></i>
                              <div slot="file" slot-scope="{file}">
                                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt=""/>
                                    <span class="el-upload-list__item-actions">
                                          <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
                                                <i class="el-icon-zoom-in"></i>
                                          </span>
                                          <span v-if="!disabled" class="el-upload-list__item-delete" @click="handleDownload(file)">
                                                <i class="el-icon-download"></i>
                                          </span>
                                          <span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file)">
                                                <i class="el-icon-delete"></i>
                                          </span>
                                    </span>
                              </div>
                        </el-upload>
                  </div>
                  <!-- 预览图片弹窗 -->
                  <el-dialog :visible.sync="dialogVisiblePreviewImg">
                        <img width="100%" :src="dialogImageUrl" alt="">
                  </el-dialog>
                  <div class="other-info">
                        用户昵称:<el-input v-model="currentUser.userName" v-if="currentUser.userName==null?'':currentUser.userName"></el-input>
                  
                        登陆密码:<el-input v-model="currentUser.userPassword" v-if="currentUser.userPassword==null?'':currentUser.userPassword"></el-input>
                        <br/>
                        当前状态:<el-input v-model="currentUser.usersState" v-if="currentUser.usersState==null?'':currentUser.usersState"></el-input>
                        
                        注册时间:<el-input v-model="currentUser.registerTime" v-if="currentUser.registerTime==null?'':currentUser.registerTime"></el-input>
                        <br/>
                        用户简介:<el-input v-model="currentUser.userDescript" class="userTextArea" type="textarea" :rows="3" v-if="currentUser.userDescript==null?'':currentUser.userDescript"></el-input>
                        <br/><br/>
                        <el-button @click="updateUserInfo()" size="small" type="primary">确定修改</el-button>
                        <el-button @click="updateUserInfo()" size="small" type="warning">信息重置</el-button>
                  </div>
            </div>
      </div>
</template>

<script>
import { isLogin,getToken,notLoginTip,getCurrentUser } from '@/utils/auth.js';
import { currUser } from '@/components/test/Test.js';
export default {
      data(){
            return{
                  currentUser:{},
                  infoSee:false,
                  dialogImageUrl: '',
                  dialogVisiblePreviewImg: false,
                  disabled: false
            }
      },
      created(){
            // 登录
            if(isLogin()){
                  this.currentUser = currUser;
                  this.infoSee = true;
                  // this.currentUser = getCurrentUser();
            }else{
                  this.$message.error(notLoginTip(1));
            }
      },
      methods: {
            // 移除
            handleRemove(file) {
                  console.log(file);
            },
            // 预览图片
            handlePictureCardPreview(file) {
                  this.dialogImageUrl = file.url;
                  this.dialogVisiblePreviewImg = true;
            },
            // 下载
            handleDownload(file) {
                  console.log(file);
            },
            // 上传
            updateUserAvatar(){

            },
            // 修改其他信息
            updateUserInfo(){

            }
    }
}
</script>

<style>
@import url('../../assets/css/myinfo.css');
</style>